<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="../cwjy/css/app.css" rel="stylesheet">
    <style>
        html::-webkit-scrollbar {
            display: none
        }
    </style>
</head>
<script src="../cwjy/js/app.js"></script>
<script src="../cwjy/js/jquery.min.js"></script>
<body>
<div class="card">
    <div class="card-header">
        <div>
            <div style="float:left;">
                <span style="font-weight: bold;font-size: 20px;text-shadow: 1px 1px 2px #000000;">寄养订单</span>
            </div>
        </div>
        <table class="table table-striped" cellpadding="0" cellspacing="0">
            <thead>
            <tr>
                <th style="width:5%;">序号</th>
                <th style="width:10%;">主人名称</th>
                <th style="width:10%">电话</th>
                <th style="width:15%">家庭住址</th>
                <th style="width:10%">寄养开始时间</th>
                <th style="width:10%">寄养预计结束时间</th>
                <th class="d-none d-md-table-cell" style="width:10%">创建时间</th>
                <th class="d-none d-md-table-cell" style="width:10%">交易状态</th>
                <th class="d-none d-md-table-cell" style="width:10%">交易操作</th>
                <th>Actions</th>
            </tr>
            </thead>
            <tbody id="tbodyDiv">

            </tbody>
        </table>
    </div>
</div>

<!--模态框-->

<div class="modal fade" id="defaultModalPrimary" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content" style="width: 130%;margin-left: -3%">
            <div class="modal-header" id="modelHead">

            </div>
            <div class="modal-body m-3">
                <div class="card-body" id="modelDiv" style="margin-top: -6%;font-weight: bold;">

                </div>
            </div>
            <div class="modal-footer" id="modelAction">

            </div>
        </div>
    </div>
</div>
<script type="text/javascript" src="../cwjy/js/ajaxAll.js"></script>
<script type="text/javascript">


    let petBoardingDateCache;

    function getPagePetBoarding() {
        let url = "http://localhost:8888/cwjy/PetBoarding/getPageAdmin";
        let json = {};
        $.ajax({
            type: 'post',
            async: false,            //异步请求（同步请求将会锁住浏览器，用户其他操作必须等待请求完成才可以执行）
            url: url,    //请求发送到Servlet
            contentType: 'application/json;charset=UTF-8',//指定消息请求类型
            data: JSON.stringify(json),
            timeout: 10000,    //超时10s
            success: function (res) { returnLogin(res);
                petBoardingDateCache = res.data;
                forEachPetBoardingDateCache();
            },
            error: function (errorMsg) {
                //请求失败时执行该函数
                alert('数据请求失败!');
            }
        });
    }

    function forEachPetBoardingDateCache() {
        let tbodyDiv = "";
        for (let i = 0; i < petBoardingDateCache.length; i++) {

            let actionDiv = "";
            if (petBoardingDateCache[i].status === 1) {
                let temp = "<a href=\"#\" class=\"btn btn-outline-secondary\"  style=\"color: #495057;box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);margin-right: 10px\" onclick=\"agree('"+petBoardingDateCache[i].id+"')\">同意</a>" +
                    "<a href=\"#\" class=\"btn btn-outline-secondary\"  style=\"color: #495057;box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);\" onclick=\"refuse('"+petBoardingDateCache[i].id+"')\">拒绝</a>";
                actionDiv += temp;
            }
            if (petBoardingDateCache[i].status === 2) {
                let temp = "<a href=\"#\" class=\"btn btn-outline-secondary\"  style=\"color: #495057;box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);margin-right: 10px\" onclick=\"checkIn('"+petBoardingDateCache[i].id+"')\">入住</a>" ;
                actionDiv += temp;
            }
            if (petBoardingDateCache[i].status === 4) {
                let temp = "<a href=\"#\" class=\"btn btn-outline-secondary\"  style=\"color: #495057;box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);margin-right: 10px\" onclick=\"complete('"+petBoardingDateCache[i].id+"')\">完成寄养</a>" ;
                actionDiv += temp;
            }
            let temp = "<tr>\n" +
                "                <td>" + (i + 1) + "</td>\n" +
                "                <td>" + petBoardingDateCache[i].master_name + "</td>\n" +
                "                <td>" + petBoardingDateCache[i].phone + "</td>\n" +
                "                <td>" + petBoardingDateCache[i].address_home + "</td>\n" +
                "                <td>" + petBoardingDateCache[i].foster_care_start_time + "</td>\n" +
                "                <td>" + petBoardingDateCache[i].foster_care_end_time + "</td>\n" +
                "                <td class=\"d-none d-md-table-cell\">" + petBoardingDateCache[i].create_date + "</td>\n" +
                "                <td class=\"d-none d-md-table-cell\">" + petBoardingDateCache[i].status_name + "</td>\n" +
                "                <td class=\"table-action\">\n" +
                "            "+actionDiv+"    </td>  " +
                "                <td class=\"table-action\">\n" +
                "  <a href=\"#\"><i class=\"align-middle\" data-feather=\"eye\" data-toggle=\"modal\"\n" +
                "                                   data-target=\"#defaultModalPrimary\" onclick=\"petOrderDetails('" + petBoardingDateCache[i].id + "')\"></i></a>\n" +
                "                    <a href=\"#\"><i class=\"align-middle\" data-feather=\"edit-2\" data-toggle=\"modal\"\n" +
                "                                   data-target=\"#defaultModalPrimary\" onclick=\"petOrderUpdate('" + petBoardingDateCache[i].id + "')\"></i></a>\n" +
                "                    <a href=\"#\"><i class=\"align-middle\" data-feather=\"trash\" onclick=\"petOrderDelete('" + petBoardingDateCache[i].id + "')\"></i></a>\n" +
                "                </td>\n" +
                "            </tr>";
            tbodyDiv += temp;
        }
        $('#tbodyDiv').html(tbodyDiv)
    }


    /**同意申请*/
    function agree(id) {
        if (confirm("是否确认同意预约")) {
            let url = "http://localhost:8888/cwjy/PetBoarding/agree";
            let json = {id: id};
            let success = "确认同意成功！";
            let error = "确认同意失败！";
            ajaxUnifiedCallUpdateAndAdd(url, json, success, error)
        }
    }
    /**拒绝申请*/
    function refuse(id) {
        if (confirm("是否确认拒绝预约")) {
            let url = "http://localhost:8888/cwjy/PetBoarding/refuse";
            let json = {id: id};
            let success = "确认拒绝成功！";
            let error = "确认拒绝失败！";
            ajaxUnifiedCallUpdateAndAdd(url, json, success, error)
        }
    }
    /**办理入住*/
    function checkIn(id) {
        if (confirm("是否确认入住")) {
            let url = "http://localhost:8888/cwjy/PetBoarding/checkIn";
            let json = {id: id};
            let success = "入住成功！";
            let error = "入住失败！";
            ajaxUnifiedCallUpdateAndAdd(url, json, success, error)
        }
    }
    /**寄养完成*/
    function complete(id) {
        if (confirm("是否确认完成寄养")) {
            let url = "http://localhost:8888/cwjy/PetBoarding/complete";
            let json = {id: id};
            let success = "完成寄养成功！";
            let error = "完成寄养失败！";
            ajaxUnifiedCallUpdateAndAdd(url, json, success, error)
        }
    }

    getPagePetBoarding();


    /**宠物订单详细*/
    function petOrderDetails(id) {
        let data = getDataIdData(petBoardingDateCache, id)
        let modelHead = "  <h3 class=\"modal-title\" id=\"modelHeadText\" style=\"font-weight: bold;text-shadow: 1px 1px 3px #000000;\">\n" +
            "                    寄养订单详细</h3>\n" +
            "                <button type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Close\">\n" +
            "                    <span aria-hidden=\"true\">×</span>\n" +
            "                </button>";
        let modelBody = "" +
            "                        <div class=\"mb-3 row\">\n" +
            "                            <label class=\"col-form-label col-sm-2 text-sm-right\">寄养开始时间</label>\n" +
            "                            <div class=\"col-sm-10\">\n" +
            "                                <input type=\"date\" id=\"create_date\"  class=\"form-control\" placeholder=\"Textarea\" rows=\"3\">\n" +
            "                            </div>\n" +
            "                        </div>\n" +
            "\n" +
            "                        <div class=\"mb-3 row\">\n" +
            "                            <label class=\"col-form-label col-sm-2 text-sm-right\">寄养完成时间</label>\n" +
            "                            <div class=\"col-sm-10\">\n" +
            "                                <input type=\"date\" id=\"complete_time\"  class=\"form-control\" placeholder=\"Textarea\" rows=\"3\">\n" +
            "                            </div>\n" +
            "                        </div>\n";
        let modelAction = "<button type=\"button\" class=\"btn btn-secondary\"  data-dismiss=\"modal\">关闭</button>";
        $('#modelHead').html(modelHead)
        initModelBody();
        $('#pet_boarding').append(modelBody)
        $('#modelAction').html(modelAction)
        $('#modelDiv input').each(function () {
            $(this).attr("disabled", "disabled");
        })
        $('#modelDiv textarea').each(function () {
            $(this).attr("disabled", "disabled");
        })
        $('#master_name').val(data.master_name);
        $('#phone').val(data.phone);
        $('#address_home').val(data.address_home);
        $('#foster_care_start_time').val(data.foster_care_start_time);
        $('#foster_care_end_time').val(data.foster_care_end_time);
        /**获取宠物类型*/
        $('#pet_type' + data.pet_type).attr("checked", "checked");
        /**是否注射狂犬疫苗*/
        $('#is_rabies_vaccine' + data.is_rabies_vaccine).attr("checked", "checked");
        /**是否发情*/
        $('#is_pregnancy_or_estrus' + data.is_pregnancy_or_estrus).attr("checked", "checked");
        $('#remarks').val(data.remarks);
        $('#checklist').val(data.checklist);
        $('#reservation_time').val(data.reservation_time.replaceAll(" ","T"));
        $('#complete_time').val(data.complete_time);
        $('#create_date').val(data.create_date.substring(0, 10));
    }

    /**宠物订单删除*/
    function petOrderDelete(id) {
        if (confirm("是否确认删除")) {
            let url = "http://localhost:8888/cwjy/PetBoarding/deleteByPrimaryKey";
            let json = {id: id};
            let success = "删除成功";
            let error = "删除失败";
            ajaxUnifiedCallUpdateAndAdd(url, json, success, error)
        }
    }


    /**宠物订单修改*/
    function petOrderUpdate(id) {

        let data = getDataIdData(petBoardingDateCache, id)
        let modelHead = " <h3 class=\"modal-title\" id=\"modelHeadText\" style=\"font-weight: bold;text-shadow: 1px 1px 3px #000000;\">\n" +
            "                    寄养订单修改</h3>\n" +
            "                <button type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Close\">\n" +
            "                    <span aria-hidden=\"true\">×</span>\n" +
            "                </button>";
        let modelAction = "  <button type=\"button\" class=\"btn btn-secondary\" data-dismiss=\"modal\">关闭</button>\n" +
            "                <button type=\"button\" class=\"btn btn-primary\" onclick=\"petBoardingUpdateData('" + id + "')\">提交</button>";
        $('#modelHead').html(modelHead)
        initModelBody();
        $('#modelAction').html(modelAction)
        $('#modelDiv input').each(function () {
            $(this).removeAttr("disabled");
        })
        $('#modelDiv textarea').each(function () {
            $(this).removeAttr("disabled");
        })

        $('#master_name').val(data.master_name);
        $('#phone').val(data.phone);
        $('#address_home').val(data.address_home);
        $('#foster_care_start_time').val(data.foster_care_start_time);
        $('#foster_care_end_time').val(data.foster_care_end_time);
        /**获取宠物类型*/
        $('#pet_type' + data.pet_type).attr("checked", "checked");
        /**是否注射狂犬疫苗*/
        $('#is_rabies_vaccine' + data.is_rabies_vaccine).attr("checked", "checked");
        /**是否发情*/
        $('#is_pregnancy_or_estrus' + data.is_pregnancy_or_estrus).attr("checked", "checked");
        $('#remarks').val(data.remarks);
        $('#checklist').val(data.checklist);
        $('#reservation_time').val(data.reservation_time.replaceAll(" ","T"));

    }

    function petBoardingUpdateData(id) {
        if (confirm("是否确认修改")) {
            let master_name = $('#master_name').val();
            let phone = $('#phone').val();
            let address_home = $('#address_home').val();
            let foster_care_start_time = $('#foster_care_start_time').val();
            let foster_care_end_time = $('#foster_care_end_time').val();

            /**获取宠物类型*/
            let pet_type_radio = $('input:radio[name="radio-3"]:checked');
            let update_pet_type = pet_type_radio[0].id;
            let pet_type = update_pet_type.substring(update_pet_type.length - 1);
            let other_type = $('#other_type').val();

            /**是否注射狂犬疫苗*/
            let is_rabies_vaccine_radio = $('input:radio[name="radio-5"]:checked');
            let update_is_rabies_vaccine = is_rabies_vaccine_radio[0].id;
            let is_rabies_vaccine = update_is_rabies_vaccine.substring(update_is_rabies_vaccine.length - 1);

            /**是否发情*/
            let is_pregnancy_or_estrus_radio = $('input:radio[name="radio-4"]:checked');
            let update_is_pregnancy_or_estrus = is_pregnancy_or_estrus_radio[0].id;
            let is_pregnancy_or_estrus = update_is_pregnancy_or_estrus.substring(update_is_pregnancy_or_estrus.length - 1);


            let remarks = $('#remarks').val();
            let checklist = $('#checklist').val();
            let reservation_time = $('#reservation_time').val().replaceAll("T"," ");
            let url = "http://localhost:8888/cwjy/PetBoarding/updateByPrimaryKeySelective";

            let json = {
                id: id,
                master_name: master_name,
                phone: phone,
                address_home: address_home
                ,
                foster_care_start_time: foster_care_start_time,
                foster_care_end_time: foster_care_end_time,
                pet_type: pet_type
                ,
                other_type: other_type,
                is_rabies_vaccine: is_rabies_vaccine,
                is_pregnancy_or_estrus: is_pregnancy_or_estrus
                ,
                remarks: remarks,
                checklist: checklist,
                reservation_time: reservation_time
            };
            let success = "修改成功";
            let error = "修改失败";
            if (master_name === "" || phone === "" || address_home === "" || foster_care_start_time === "" || foster_care_end_time === ""
                || pet_type === "" || is_rabies_vaccine === "" || is_pregnancy_or_estrus === "") {
                alert('有资料未输入,请输入！')
                return;
            }
            if (!isPhoneNo(phone)) {
                alert('手机号码输入错误，请重新输入')
                return;
            }
            ajaxUnifiedCallUpdateAndAdd(url, json, success, error)
        }
    }

    function initModelBody(data) {
        let modelBody = "  <form  style=\"font-weight: bold;font-size: 15px;text-shadow: 2px 2px 2px #cccccc;\" id = 'pet_boarding'>\n" +
            "                        <div class=\"mb-3 row\">\n" +
            "                            <label class=\"col-form-label col-sm-2 text-sm-right\">主人姓名</label>\n" +
            "                            <div class=\"col-sm-10\">\n" +
            "                                <input type=\"text\" class=\"form-control\" id=\"master_name\" placeholder=\"主人姓名\">\n" +
            "                            </div>\n" +
            "                        </div>\n" +
            "                        <div class=\"mb-3 row\">\n" +
            "                            <label class=\"col-form-label col-sm-2 text-sm-right\">电话</label>\n" +
            "                            <div class=\"col-sm-10\">\n" +
            "                                <input type=\"text\" class=\"form-control\" id=\"phone\"   placeholder=\"电话\">\n" +
            "                            </div>\n" +
            "                        </div>\n" +
            "                        <div class=\"mb-3 row\">\n" +
            "                            <label class=\"col-form-label col-sm-2 text-sm-right\">详细地址</label>\n" +
            "                            <div class=\"col-sm-10\">\n" +
            "                                <input type=\"text\" class=\"form-control\" id=\"address_home\"  placeholder=\"详细地址\" rows=\"3\"></input>\n" +
            "                            </div>\n" +
            "                        </div>\n" +
            "                        <div class=\"mb-3 row\">\n" +
            "                            <label class=\"col-form-label col-sm-2 text-sm-right\">寄养开始日期</label>\n" +
            "                            <div class=\"col-sm-10\">\n" +
            "                                <input type=\"date\" id=\"foster_care_start_time\"  class=\"form-control\" placeholder=\"寄养开始日期\" rows=\"3\"></input>\n" +
            "                            </div>\n" +
            "                        </div>\n" +
            "\n" +
            "                        <div class=\"mb-3 row\">\n" +
            "                            <label class=\"col-form-label col-sm-2 text-sm-right\">预计结束日期</label>\n" +
            "                            <div class=\"col-sm-10\">\n" +
            "                                <input  type=\"date\"  class=\"form-control\" id=\"foster_care_end_time\"  placeholder=\"预计结束日期\" rows=\"3\"></input>\n" +
            "                            </div>\n" +
            "                        </div>\n" +
            "\n" +
            "                        <fieldset class=\"mb-3\" id=\"pet_type\" >\n" +
            "                            <div class=\"row\">\n" +
            "                                <label class=\"col-form-label col-sm-2 text-sm-right pt-sm-0\">宠物种类</label>\n" +
            "                                <div class=\"col-sm-10\">\n" +
            "                                    <label class=\"form-check\">\n" +
            "                                        <input name=\"radio-3\" type=\"radio\" id = \"pet_type3\" class=\"form-check-input\" >\n" +
            "                                        <span class=\"form-check-label\">普通狗狗</span>\n" +
            "                                    </label>\n" +
            "                                    <label class=\"form-check\">\n" +
            "                                        <input name=\"radio-3\" type=\"radio\" id = \"pet_type4\" class=\"form-check-input\" >\n" +
            "                                        <span class=\"form-check-label\">普通猫</span>\n" +
            "                                    </label>\n" +
            "                                    <label class=\"form-check\">\n" +
            "                                        <input name=\"radio-3\" type=\"radio\" id = \"pet_type5\" class=\"form-check-input\" >\n" +
            "                                        <span class=\"form-check-label\">其它</span>\n" +
            "                                    </label>\n" +
            "                                </div>\n" +
            "                            </div>\n" +
            "                        </fieldset>\n" +
            "\n" +
            "                        <div class=\"mb-3 row\">\n" +
            "                            <label class=\"col-form-label col-sm-2 text-sm-right\">其他品种</label>\n" +
            "                            <div class=\"col-sm-10\">\n" +
            "                                <input  type=\"text\" id=\"other_type\"  class=\"form-control\" placeholder=\"其他品种\" rows=\"3\"></input>\n" +
            "                            </div>\n" +
            "                        </div>\n" +
            "                        <fieldset class=\"mb-3\" id=\"is_rabies_vaccine\" >\n" +
            "                            <div class=\"row\">\n" +
            "                                <label class=\"col-form-label col-sm-2 text-sm-right pt-sm-0\">是否接种狂犬疫苗</label>\n" +
            "                                <div class=\"col-sm-10\">\n" +
            "                                    <label class=\"form-check\">\n" +
            "                                        <input name=\"radio-5\" type=\"radio\" id = \"is_rabies_vaccine1\" class=\"form-check-input\" checked>\n" +
            "                                        <span class=\"form-check-label\">是</span>\n" +
            "                                    </label>\n" +
            "                                    <label class=\"form-check\">\n" +
            "                                        <input name=\"radio-5\" type=\"radio\" id = \"is_rabies_vaccine0\" class=\"form-check-input\">\n" +
            "                                        <span class=\"form-check-label\">否</span>\n" +
            "                                    </label>\n" +
            "                                </div>\n" +
            "                            </div>\n" +
            "                        </fieldset>\n" +
            "\n" +
            "                        <fieldset class=\"mb-3\" id=\"is_pregnancy_or_estrus\" >\n" +
            "                            <div class=\"row\">\n" +
            "                                <label class=\"col-form-label col-sm-2 text-sm-right pt-sm-0\">是否发情或怀孕</label>\n" +
            "                                <div class=\"col-sm-10\">\n" +
            "                                    <label class=\"form-check\">\n" +
            "                                        <input name=\"radio-4\" type=\"radio\" id = 'is_pregnancy_or_estrus1' class=\"form-check-input\" checked>\n" +
            "                                        <span class=\"form-check-label\">是</span>\n" +
            "                                    </label>\n" +
            "                                    <label class=\"form-check\">\n" +
            "                                        <input name=\"radio-4\" type=\"radio\" id = \"is_pregnancy_or_estrus0\" class=\"form-check-input\">\n" +
            "                                        <span class=\"form-check-label\">否</span>\n" +
            "                                    </label>\n" +
            "                                </div>\n" +
            "                            </div>\n" +
            "                        </fieldset>\n" +
            "\n" +
            "\n" +
            "                        <div class=\"mb-3 row\">\n" +
            "                            <label class=\"col-form-label col-sm-2 text-sm-right\">寄养备注</label>\n" +
            "                            <div class=\"col-sm-10\">\n" +
            "                                <textarea class=\"form-control\" id=\"remarks\"  placeholder=\"寄养备注\" rows=\"3\"></textarea>\n" +
            "                            </div>\n" +
            "                        </div>\n" +
            "\n" +
            "                        <div class=\"mb-3 row\">\n" +
            "                            <label class=\"col-form-label col-sm-2 text-sm-right\">物品清单</label>\n" +
            "                            <div class=\"col-sm-10\">\n" +
            "                                <textarea class=\"form-control\" id=\"checklist\"  placeholder=\"物品清单\" rows=\"3\"></textarea>\n" +
            "                            </div>\n" +
            "                        </div>\n" +
            "\n" +
            "                        <div class=\"mb-3 row\">\n" +
            "                            <label class=\"col-form-label col-sm-2 text-sm-right\">预约上门时间</label>\n" +
            "                            <div class=\"col-sm-10\">\n" +
            "                                <input type=\"datetime-local\" id=\"reservation_time\"  class=\"form-control\" placeholder=\"Textarea\" rows=\"3\"></input>\n" +
            "                            </div>\n" +
            "                        </div>\n" +
            "                    </form>";
        $('#modelDiv').html(modelBody)
    }


    function addType() {
        addNodeMessage("")
        feather.replace();
        initClassificationDetailedClick();
    }

    function addNodeMessage(name) {
        let temp = "    <div class=\"col-md-12\" >\n" +
            "                                    <div class=\"col-md-11\" style=\"float: left\">\n" +
            "                                        <input type=\"text\" class=\"form-control \"\n" +
            "                                               placeholder=\"类型名称\" value='" + name + "' style=\"margin-bottom: 10px\">\n" +
            "                                    </div>\n" +
            "                                    <div class=\"col-md-1\" style=\"float: left\">\n" +
            "                                   <span>     <button type=\"button\" data-feather=\"x-circle\"\n" +
            "                                                style=\"float: right;margin-top: 15%;color: red\"></button>\n" +
            "                                    </div></span>\n" +
            "                                </div>";
        $('#classification_detailed').append(temp)
    }

    function initClassificationDetailedClick() {
        $('#classification_detailed span').unbind("click")
        $('#classification_detailed span').click(function () {
            if (confirm('是否删除该节点?')) {
                $(this).parent().parent().remove()
            }
        })
    }

    initClassificationDetailedClick();

    function addData() {
        let classification_name = $('#classification_name');
        let type_name = $('#classification_detailed')
        type_name.find("input").each(function () {
        })
    }

    function initMode(onType) {
        let modiv = "<div class=\"mb-3 col-md-12\">\n" +
            "                            <label class=\"form-label\" for=\"classification_name\">类别名称</label>\n" +
            "                            <input type=\"email\" class=\"form-control\" id=\"classification_name\" placeholder=\"类别名称\">\n" +
            "                        </div>\n" +
            "                        <div class=\"mb-3  col-md-12\">\n" +
            "                            <label class=\"form-label\">类型名称</label>\n" +
            "                            <button type=\"button\" class=\"form-label\" for=\"type_name\" data-feather=\"plus-circle\"\n" +
            "                                    style=\"float: right\" onclick=\"addType()\"></button>\n" +
            "                            <div id=\"classification_detailed\">\n" +
            "                                <div class=\"col-md-12\">\n" +
            "                                    <div class=\"col-md-11\" style=\"float: left\">\n" +
            "                                        <input type=\"text\" class=\"form-control \"\n" +
            "                                               placeholder=\"类型名称\" style=\"margin-bottom: 10px\">\n" +
            "                                    </div>\n" +
            "                                    <div class=\"col-md-1\" style=\"float: left\">\n" +
            "                                        <span>\n" +
            "                                        <button type=\"button\" data-feather=\"x-circle\"\n" +
            "                                                style=\"float: right;margin-top: 15%;color: red\"\n" +
            "                                        ></button>\n" +
            "                                            </span>\n" +
            "                                    </div>\n" +
            "                                </div>\n" +
            "                            </div>\n" +
            "                        </div>";
        $('#modelDiv').html(modiv)

        let modelHead = " <h3 class=\"modal-title\" id='modelHeadText'>类别增加</h3>\n" +
            "                <button type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Close\">\n" +
            "                    <span aria-hidden=\"true\">&times;</span>\n" +
            "                </button>";

        $('#modelHead').html(modelHead)

        let modelAction = " <button type=\"button\" class=\"btn btn-secondary\" data-dismiss=\"modal\">Close</button>\n" +
            "                <button type=\"button\" class=\"btn btn-primary\" onclick=\"" + onType + "\">Save changes</button>";
        $('#modelAction').html(modelAction)
        feather.replace();
    }


    function initModeViewDetails() {
        let modelHead = "<h3 class=\"modal-title\">类别详细</h3>\n" +
            "                   <button type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-label=\"Close\">\n" +
            "                       <span aria-hidden=\"true\">&times;</span>\n" +
            "                   </button>";
        let modelDiv = "   <h1>类别名称</h1>\n" +
            "                    <p class=\"text-muted\">Etiam rhoncus. Maecendio et ante tincidunt tempus. Donec vitae sapien ut libero.</p>\n" +
            "                    <h1>类型详细</h1>\n" +
            "                    <p class=\"text-muted\">Etiam rhoncus. Maecenatincidunt tempus. Donec vitae sapien ut libero.</p>\n" +
            "                    <p class=\"text-muted\">Etiam rhoncus. Maecenatincidunt tempus. Donec vitae sapien ut libero.</p>\n" +
            "                    <p class=\"text-muted\">Etiam rhoncus. Maecenatincidunt tempus. Donec vitae sapien ut libero.</p>\n" +
            "                    <p class=\"text-muted\">Etiam rhoncus. Maecenatincidunt tempus. Donec vitae sapien ut libero.</p>";
        let modelAction = "  <button type=\"button\" class=\"btn btn-secondary\" data-dismiss=\"modal\">Close</button>";
        $('#modelHead').html(modelHead)
        $('#modelDiv').html(modelDiv)
        $('#modelAction').html(modelAction)
    }

    function updateText() {
        initMode('updateData()');
        $('#classification_detailed').html("")
        $('#modelHeadText').html("类型修改")
        $('#classification_name').val("测试")
        for (let i = 0; i < 5; i++) {
            addNodeMessage("测试" + i);
        }
        initClassificationDetailedClick();
        feather.replace();
    }

    function updateData() {
        alert('修改成功')
    }


</script>

</body>
</html>